<include file="public@header"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>班级详情</title>
	<link rel="stylesheet" type="text/css" href="__STATIC__/user_center/css/ui.css">
	<link href="iTunesArtwork@2x.png" sizes="114x114" rel="apple-touch-icon-precomposed">
	<link type="text/css" rel="stylesheet" href="__STATIC__/user_center/css/basic.css" />
	<link rel="stylesheet" href="__STATIC__/calendar/css/reset.css" />
<link rel="stylesheet" type="text/css" href="__STATIC__/calendar/css/simple-calendar.css">
<link rel="stylesheet" href="__STATIC__/calendar/css/calendar.css" />
<style>
li.active > a{
	color:#000!important;
}
li > a{
	color:#fff!important;
}
</style>
</head>
<body>
	<!--header 开始-->
  <header style="width:100%;">
    <div class="header" style="width:100%;"> 
		<a class="new-a-back" href="javascript:history.back();"><span style="text-indent:0px;"><返回</span></a>
		<h2>班级详情</h2>
		<!-- <a class="new-a-jd" id="trigger-overlay" href="javascript:void(0)"> <span>导航菜单</span> </a> -->
    </div>
  </header>
  <!--header 结束-->
<div>
	<div class="row-fluid">
		<div class="span12 tab-wrapper">
			<ul class="nav nav-tabs tab-menu">
				<li class="active" style="width:25%"><a class="btn btn-sm btn-info" href="#" style="outline:none;">课表</a></li>
				<li style="width:25%"><a class="btn btn-sm btn-info" href="#" style="outline:none;">名单</a></li>
				<li style="width:25%"><a class="btn btn-sm btn-info" href="#" style="outline:none;">考勤</a></li>
				<li style="width:25%"><a class="btn btn-sm btn-info" href="#" style="outline:none;">课堂资料</a></li>
			</ul>
			<div class="tab-content">
				<div>
					<div>
						<div>
							<div class="span12">
								<div class="inner">
									<div id='calendar' class="sc-calendar">
										<div class="sc-header">
											<div class="sc-title">
												<div class="year"><span class="sc-select-year" name=""></span>年</div>
												<div class="month">
													<div class="arrow sc-mleft"></div>
													<div class="monthdiv">
														<span class="sc-select-month" name=""></span>
													</div>
													<div class="arrow sc-mright"></div>
												</div>
											</div>
											<div class="sc-week"></div> 
										</div>
										<div class="sc-body">
											<div class="sc-days"></div>
										</div>
									</div>
									<div class="announcement">
										<ul class="matter">
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div>
					<table class="table table-striped">
					<thead>
						<tr>
							<th>序号</th>
							<th>姓名</th>
							<th>电话</th>
							<th>备用电话</th>
						</tr>
					</thead>
					<tbody>
						<foreach name="students" item="vo" key="key">
							<tr>
								<td>{$key+1}</td>
								<td>{$vo.name}</td>
								<td><a href="tel:{$vo.phone}">{$vo.phone}</a></td>
								<td><a href="tel:{$vo.phone2}">{$vo.phone2}</a></td>
							</tr>
						</foreach>
					</tbody>
				</table>
				</div>
				<div>
					<php>$default_timetable_data = json_decode($timetable_data,true);$default = reset($default_timetable_data);</php>
					<iframe frameborder="0;" src="{:url('admin/class/class_attendance',['timetable_id'=>$default[0]['id']])}" width="100%;" scrolling="auto" seamless id="attendance_iframe" onload="javascript:changeFrameHeight(this)"></iframe>
				</div>
				<div>
				<iframe frameborder="0;" src="{:url('admin/class/class_blog_list',['class_id'=>$param['id']])}" width="100%;" seamless id="blog_iframe" onload="javascript:changeFrameHeight(this)"></iframe>
				</div>
			  </div>
		</div>
	</div>
</div>
<include file="portal/wx_admin@footer">

</body>

<script type="text/javascript" src="__STATIC__/calendar/js/simple-calendar.js"></script>
<script type="text/javascript" src="__STATIC__/calendar/js/hammer-2.0.8-min.js"></script>
<script type="text/javascript">
	var myCalendar = new SimpleCalendar('#calendar');
	$(function(){
		var monthCH = $('.sc-select-month').text();
		$(".sc-mleft").click(function(){
			myCalendar.subMonth();
		   var year = $('.sc-select-year').text();
		   var monthCH = $('.sc-select-month').text();
		   var month = SimpleCalendar.prototype.languageData.months_CH.indexOf(monthCH)+1;
	   })
		$(".sc-mright").click(function(){
			myCalendar.addMonth();
			var year = $('.sc-select-year').text();
			var monthCH = $('.sc-select-month').text();
			var month = SimpleCalendar.prototype.languageData.months_CH.indexOf(monthCH)+1;
		})
	});
	
	//滑动切换
	var myElement = document.getElementById('calendar');
　　  			var hammer = new Hammer(myElement);
	hammer.on("swipeleft", function (ev) {
		myCalendar.addMonth();
	});
	hammer.on("swiperight", function (ev) {
		myCalendar.subMonth();
	});
	
	//添加标记
	var mark = {$timetable_data};
	myCalendar._defaultOptions.mark=mark;
	myCalendar.update();
	
	
	
	//显示当天的活动在初始化mark之后
	//初始化今天的活动
	announceList($('.sc-today'));
	//有标记的日期点击事件
	$('#calendar').on("click", '.sc-selected', function() {
		announceList($(this));
	});
	
	//显示选择日期当天的课程
	function announceList(v){
		if(v.children().hasClass('sc-mark-show')){
			var year = $('.sc-select-year').text();
			var monthCH = $('.sc-select-month').text();
			var day = v.children()[1].innerText;
			var month = SimpleCalendar.prototype.languageData.months_CH.indexOf(monthCH)+1;
			var date = year + '-' + month + '-' + day;
			var content = mark[date];
			var matterHtml='';
			for(var i=0;i<content.length;i++){
				matterHtml +='<li class="announceItem"><div><div class="fl announceImg">'
					+'<img class=" " src="__STATIC__/calendar/images/content.png"></div>'
					+'<p class="announceContent">'+content[i].title+'</p>'
					+'<p class="announceContent">'+content[i].startTime+' - '+content[i].endTime+'</p></div></li>';
				if(content[i]['student_data']!=null&&content[i]['student_data']!=''&&content[i]['student_data']!=undefined){
					$("#myiframe").attr('src',"{:url('admin/class/class_attendance','','',true)}/timetable_id/"+content[i]['id']);
					matterHtml +='<div><table class="table table-striped"><thead><tr><th style="width:15%;">序号</th><th>姓名</th><th>电话</th><th>备用电话</th></tr></thead><tbody>';
					var attendance_2=[];
					attendance_2['data']='<tr><td colspan="4" style="text-align:center;" class="info">调出</td></tr>';
					attendance_2['count'] = 0;
					var attendance_3=[];
					attendance_3['data']='<tr><td colspan="4" style="text-align:center;" class="warning">请假</td></tr>';
					attendance_3['count'] = 0;
					var attendance_5=[];
					attendance_5['data']='<tr><td colspan="4" style="text-align:center;" class="danger">调入</td></tr>';
					attendance_5['count'] = 0;
					for(var x=0;x<content[i]['student_data'].length;x++){
						switch(content[i]['student_data'][x]['code']){
							case 2:
								attendance_2['data'] += '<tr><td>'+(attendance_2['count']+1)+'</td><td>'+content[i]['student_data'][x].student_name+'</td><td><a href="tel:'+content[i]['student_data'][x].phone+'">'+content[i]['student_data'][x].phone+'</a></td><td><a href="tel:'+content[i]['student_data'][x].phone2+'">'+content[i]['student_data'][x].phone2+'</a></td></tr>';
								attendance_2['count'] +=1;
								break;
							case 3:
								attendance_3['data'] += '<tr><td>'+(attendance_3['count']+1)+'</td><td>'+content[i]['student_data'][x].student_name+'</td><td><a href="tel:'+content[i]['student_data'][x].phone+'">'+content[i]['student_data'][x].phone+'</a></td><td><a href="tel:'+content[i]['student_data'][x].phone2+'">'+content[i]['student_data'][x].phone2+'</a></td></tr>';
								attendance_3['count'] +=1;
								break;
							case 5:
								attendance_5['data'] += '<tr><td>'+(attendance_5['count']+1)+'</td><td>'+content[i]['student_data'][x].student_name+'</td><td><a href="tel:'+content[i]['student_data'][x].phone+'">'+content[i]['student_data'][x].phone+'</a></td><td><a href="tel:'+content[i]['student_data'][x].phone2+'">'+content[i]['student_data'][x].phone2+'</a></td></tr>';
								attendance_5['count'] +=1;
								break;
						}
					}
					matterHtml += (attendance_5['count']==0?'':attendance_5['data'])+(attendance_2['count']==0?'':attendance_2['data'])+(attendance_3['count']==0?'':attendance_3['data'])+'</tbody></table></div>';
				}
			}
			$('.matter').html(matterHtml);
		}else{
			var matterHtml=''
			matterHtml +='<li class="announceItem"><div><p class="announceContent">当前日期暂无课程</p></div></li>';
			$('.matter').html(matterHtml);
		}
	}
	
</script>

<script>
$(document).ready(function() {
  
  var $wrapper = $('.tab-wrapper'),
      $allTabs = $wrapper.find('.tab-content > div'),
      $tabMenu = $wrapper.find('.tab-menu li');
      <!-- $line = $('<div class="line"></div>').appendTo($tabMenu); -->
  
  $allTabs.not(':first-of-type').hide();  
  <!-- $tabMenu.filter(':first-of-type').find(':first').width('100%') -->
  
  $tabMenu.each(function(i) {
    $(this).attr('data-tab', 'tab'+i);
  });
  
  $allTabs.each(function(i) {
    $(this).attr('data-tab', 'tab'+i);
  });
  
  $tabMenu.on('click', function() {
    var dataTab = $(this).data('tab'),
        $getWrapper = $(this).closest($wrapper);
    
    $getWrapper.find($tabMenu).removeClass('active');
    $(this).addClass('active');
    
    <!-- $getWrapper.find('.line').width(0); -->
    <!-- $(this).find($line).animate({'width':'100%'}, 'fast'); -->
    $getWrapper.find($allTabs).hide();
    $getWrapper.find($allTabs).filter('[data-tab='+dataTab+']').show();
  });

});//end ready

function changeFrameHeight(e){
    e.height=$(window).height();
}

window.onresize=function(){  
     changeFrameHeight($("iframe"));
}

function imagePreviewDialog(img) {
    Wind.css('layer');

    Wind.use("layer", function () {
        layer.photos({
            photos: {
                "title": "", //相册标题
                "id": 'image_preview', //相册id
                "start": 0, //初始显示的图片序号，默认0
                "data": [   //相册包含的图片，数组格式
                    {
                        "alt": "",
                        "pid": 666, //图片id
                        "src": img, //原图地址
                        "thumb": img //缩略图地址
                    }
                ]
            } //格式见API文档手册页
            , anim: 5, //0-6的选择，指定弹出图片动画类型，默认随机
            shadeClose: true,
            // skin: 'layui-layer-nobg',
            shade: [0.5, '#000000'],
            shadeClose: true,
        })
    });
}
</script>
</html>